<template>
  <div class="app-container">
    <Pagetitle
      :title="pageTitle.title"
      :name="pageTitle.name"
      :btnName="pageTitle.btnName"
      :btnClear="pageTitle.btnClear"
      @btnFun="btnFun"
      @btnClear="clearSearch"
    ></Pagetitle>
    <div class="filter-container">

    </div>
    <div class="table-container">
      <Table
        stripe
        :loading="dataTable.loading"
        :border="dataTable.border"
        :columns="dataTable.columns"
        :data="dataTable.data"
      >
        <template
          slot-scope="{row,index}"
          slot="action"
        >
          <div
            class="btn-table-box"
            v-if="row.freezeType === 1"
          >
            <div
              class="btn-text-blue"
              @click="showEditorUser(row)"
            >编辑</div>

            <div
              class="btn-text-blue"
              @click="showGropList(row)"
            >查看组</div>
            <div
              class="btn-text-blue"
              v-if="row.isLeader"
              @click="showdownLeader(row)"
            >降为组员</div>
            <div
              class="btn-text-blue"
              v-else
              @click="showEditorLeader(row)"
            >升为组长</div>

            <Poptip
              confirm
              width="200"
              placement="top-end"
              :title="'你确定让'+row.name+'离职么？'"
              @on-ok="liveUser(row)"
              @on-cancel=""
            >
              <div class="btn-text-blue">离职</div>
            </Poptip>
            <Poptip
              confirm
              width="200"
              placement="top-end"
              :title="'确定要重置'+row.name+'密码？'"
              @on-ok="resetUserPwd(row)"
              @on-cancel=""
            >
              <div class="btn-text-blue">重置密码</div>
            </Poptip>
          </div>
          <div v-else>
            -
          </div>
        </template>
      </Table>

      <Row class="mtop20">
        <Col
          :md="4"
          class="flex-start-center height-30 page"
        >
        <div>
          共{{count}}条
          <Select
            v-model="limit"
            size="small"
            class="lz-select-width"
            @on-change="changePageSize(1)"
          >
            <Option
              v-for="item in pageSizeSeletc"
              :value="item.value"
              :key="item.value"
            >{{ item.label }}</Option>
          </Select>
        </div>
        </Col>
        <Col
          :md="12"
          class="flex-center-center height-30"
        >
        <Page
          v-if="pageshow"
          :total="count"
          :page-size="limit"
          @on-change="changePageSize"
          size="small"
          show-elevator
        />
        </Col>
        <Col :md="8">
        <div class="page-size">
          <div
            class="keying-btn border-red"
            @click="showAddUser(false)"
          >新增组长</div>
          <div
            class="keying-btn border-red"
            @click="showAddUser(true)"
          >新增组员</div>
          <div
            class="keying-btn border-red"
            @click="downLoadExl()"
          >下载表格</div>
        </div>
        </Col>
      </Row>
    </div>

    <Modal
      v-model="addUserModal"
      :closable="false"
      :footer-hide="true"
    >
      <div class="modal-content">
        <Form
          ref="addUserForm"
          :model="addUserForm"
          :rules="ruleValidate"
          :label-width="80"
        >
          <div class="modal-header">
            <span>新增组员</span>
            <a @click="closeModal('addUserForm')">
              <svg-icon icon-class="close" />
            </a>
          </div>
          <div class="modal-body">
            <Row>
              <Col :span="12">
              <FormItem
                label="姓名"
                prop="name"
              >
                <Input
                  v-model="addUserForm.name"
                  placeholder="请输入姓名"
                ></Input>
              </FormItem>
              </Col>
              <Col :span="12">
              <FormItem
                label="工号"
                prop="userId"
              >
                <Input
                  v-model="addUserForm.userId"
                  placeholder="请输入工号"
                ></Input>
              </FormItem>
              </Col>
            </Row>

            <Row>
              <Col :span="12">
              <FormItem
                label="部门"
                prop="departmentId"
              >
                <Select
                  v-model="addUserForm.departmentId"
                  placeholder="全部部门"
                >
                  <Option value="">全部部门</Option>
                  <Option
                    v-for="(depart,index) in departmentListSelect"
                    :key="depart.id"
                    :value="depart.id"
                  >{{depart.departmentName}}</Option>
                  </Option>
                </Select>
              </FormItem>
              </Col>
              <Col :span="12">
              <FormItem
                label="组别"
                prop="categoryName"
              >
                <Select
                  v-model="addUserForm.categoryName"
                  placeholder="全部组别"
                >
                  <Option value="">全部组别</Option>
                  <template v-for="(category,index) in categoryListSelect">
                    <Option
                      :key="index"
                      :value="category.categoryName"
                    >{{category.categoryName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col
                :span="12"
                v-if="isAddLeader"
              >
              <FormItem
                label="级别"
                prop="levelName"
              >
                <Select
                  v-model="addUserForm.levelName"
                  placeholder="全部级别"
                >
                  <Option value="">全部级别</Option>
                  <template v-for="(level,index) in levelListSelect">
                    <Option
                      :key="index"
                      :value="level.levelName"
                    >{{level.levelName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
              <Col
                :span="12"
                v-if="isAddLeader"
              >
              <FormItem
                label="组长"
                prop="auditId"
              >
                <Select
                  v-model="addUserForm.auditId"
                  placeholder="全部组长"
                >
                  <Option value="">全部组长</Option>
                  <template v-for="audit in auditListSelect">
                    <Option
                      :key="audit.auditId"
                      :value="audit.auditId"
                      v-if="audit.departmentId === addUserForm.departmentId"
                    >{{audit.auditName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
            </Row>

          </div>
          <div class="modal-footer">
            <Button @click="closeModal('addUserForm')">取消</Button>
            <Button
              type="primary"
              @click="handleSubmitAddUser('addUserForm')"
            >确定</Button>
          </div>
        </Form>
      </div>
    </Modal>

    <Modal
      v-model="editorUserModal"
      :closable="false"
      :footer-hide="true"
    >
      <div class="modal-content">
        <Form
          ref="editorUserForm"
          :model="editorUserForm"
          :rules="ruleValidate"
          :label-width="80"
        >
          <div class="modal-header">
            <span>编辑{{editorUserForm.levelName !== '组长'?'组员':'组长'}}</span>
            <a @click="closeModal('editorUserForm')">
              <svg-icon icon-class="close" />
            </a>
          </div>
          <div class="modal-body">
            <div class="modal-user-info">
              {{editorUserForm.departName}} {{editorUserForm.name}}（工号：{{editorUserForm.userId}}）
            </div>
            <Row>
              <Col :span="12">
              <FormItem
                label="组别"
                prop="categoryName"
              >
                <Select
                  v-model="editorUserForm.categoryName"
                  placeholder="全部组别"
                >
                  <Option value="">全部组别</Option>
                  <template v-for="(category,index) in categoryListSelect">
                    <Option
                      :key="index"
                      :value="category.categoryName"
                    >{{category.categoryName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
              <Col
                :span="12"
                v-if="editorUserForm.levelName !== '组长'"
              >
              <FormItem
                label="级别"
                prop="levelName"
              >
                <Select
                  v-model="editorUserForm.levelName"
                  placeholder="全部级别"
                >
                  <Option value="">全部级别</Option>
                  <template v-for="(level,index) in levelListSelect">
                    <Option
                      :key="index"
                      :value="level.levelName"
                    >{{level.levelName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col
                :span="12"
                v-if="editorUserForm.levelName !== '组长'"
              >
              <FormItem
                label="组长"
                prop="auditId"
              >
                <Select
                  v-model="editorUserForm.auditId"
                  placeholder="全部组长"
                >
                  <Option value="">全部组长</Option>
                  <template v-for="audit in auditListSelect">
                    <Option
                      :key="audit.auditId"
                      :value="audit.auditId"
                      v-if="audit.departmentId === editorUserForm.departmentId"
                    >{{audit.auditName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
              <Col :span="12">

              </Col>
            </Row>

          </div>
          <div class="modal-footer">
            <Button @click="closeModal('editorUserForm')">取消</Button>
            <Button
              type="primary"
              @click="handleSubmitEditorUser('editorUserForm')"
            >确定</Button>
          </div>
        </Form>
      </div>
    </Modal>

    <Modal
      v-model="searchModal"
      :closable="false"
      :footer-hide="true"
    >
      <div class="modal-content">
        <Form
          ref="searchForm"
          :model="searchForm"
          :rules="ruleValidate"
          :label-width="80"
        >
          <div class="modal-header">
            <span>高级搜索</span>
            <a @click="closeModal()">
              <svg-icon icon-class="close" />
            </a>
          </div>
          <div class="modal-body">
            <Row>
              <Col :span="24">
              <FormItem label="人员">
                <RadioGroup
                  v-model="searchForm.typeRadio"
                  @on-change="changeUserRadioGrioup()"
                >
                  <Radio label="">默认</Radio>
                  <Radio label="1">按审核人</Radio>
                  <Radio label="2">按工号</Radio>
                </RadioGroup>
              </FormItem>
              </Col>
              <Col
                :span="24"
                v-if="searchForm.typeRadio !== '2'"
              >
              <FormItem label="部门">
                <RadioGroup v-model="searchForm.departmentId">
                  <Radio label="">全部</Radio>
                  <Radio
                    v-for="(departRadio,index) in departmentListSelect"
                    :key="index"
                    :label="departRadio.id"
                  >{{departRadio.departmentName}}</Radio>
                </RadioGroup>
              </FormItem>
              </Col>
            </Row>
            <Row v-if="searchForm.typeRadio === ''">
              <Col :span="12">
              <FormItem label="组别">
                <Select
                  v-model="searchForm.categoryName"
                  placeholder="全部组别"
                >
                  <Option value="">全部组别</Option>
                  <Option
                    v-for="(category,index) in categoryListSelect"
                    :key="index"
                    :value="category.categoryName"
                  >{{category.categoryName}}</Option>
                </Select>
              </FormItem>
              </Col>
              <Col :span="12">
              <FormItem label="职位/级别">
                <Select
                  v-model="searchForm.levelName"
                  placeholder="全部级别"
                >
                  <Option value="">全部级别</Option>
                  <Option value="组长">组长</Option>
                  <template v-for="(level,index) in levelListSelect">
                    <Option
                      :key="index"
                      :value="level.levelName"
                    >{{level.levelName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
            </Row>
            <Row v-if="searchForm.typeRadio === '1'">
              <Col :span="12">
              <FormItem label="审核人">
                <Select
                  v-model="searchForm.auditId"
                  placeholder="全部审核人"
                >
                  <Option value="">全部审核人</Option>
                  <template v-for="(audit,index) in auditListSelect">
                    <Option
                      :key="index"
                      :value="audit.auditId"
                      v-if="searchForm.departmentId === audit.departmentId"
                    >{{audit.auditName}}</Option>
                    <Option
                      :key="index"
                      :value="audit.auditId"
                      v-else-if="searchForm.departmentId ===''"
                    >{{audit.auditName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col
                :span="12"
                v-if="searchForm.typeRadio === '2'"
              >
              <FormItem label="组员">
                <Input
                  v-model="searchForm.userId"
                  placeholder="输入工号"
                ></Input>
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col :span="12">
              <FormItem label="状态">
                <Select
                  v-model="searchForm.freeze"
                  placeholder="全部状态"
                >
                  <Option value="">全部状态</Option>
                  <Option value="1">在职</Option>
                  <Option value="0">离职</Option>
                </Select>
              </FormItem>
              </Col>
            </Row>
          </div>
          <div class="modal-footer">
            <Button @click="closeModal()">取消</Button>
            <Button
              type="primary"
              @click="search()"
            >确定</Button>
          </div>
        </Form>
      </div>
    </Modal>
    <Modal
      v-model="groupUserModal"
      :closable="false"
      :footer-hide="true"
    >
      <div class="modal-content">

        <div class="modal-header">
          <span>查看成员</span>
          <a @click="closeModal()">
            <svg-icon icon-class="close" />
          </a>
        </div>
        <div class="modal-body">
          <template v-for="user in groupUserSelect">
            <Row>
              <Col
                :span="24"
                :key="user.userId"
                v-if="user.roleId === 4"
              >
              组长：<span class="group-user">{{user.name}}</span>（工号：{{user.userId}}）
              </Col>
            </Row>
          </template>
          <Row>
            <template v-for="user in groupUserSelect">
              <Col
                :span="8"
                :key="user.userId"
                v-if="user.roleId !== 4"
              >
              <span class="group-user">{{user.name}}</span>（工号：{{user.userId}}）
              </Col>
            </template>

          </Row>
        </div>
        <div class="modal-footer">
          <Button
            type="primary"
            @click="closeModal()"
          >确定</Button>
        </div>
      </div>
    </Modal>

    <Modal
      v-model="editorLeaderModal"
      :closable="false"
      :footer-hide="true"
    >
      <div class="modal-content">
        <Form
          ref="editorLeaderForm"
          :model="editorLeaderForm"
          :rules="ruleValidate"
          :label-width="80"
        >
          <div class="modal-header">
            <span>组长编辑</span>
            <a @click="closeModal('editorLeaderForm')">
              <svg-icon icon-class="close" />
            </a>
          </div>
          <div class="modal-body">
            <div class="modal-user-info">
              {{editorLeaderForm.departmentName}} {{editorLeaderForm.name}}（工号：{{editorLeaderForm.userId}}）
            </div>
            <Row>
              <Col :span="24">
              <RadioGroup
                v-model="editorLeaderForm.radio"
                vertical
              >
                <Radio label="0">
                  <span>替换原组长</span>
                </Radio>
                <div>
                  替换组长后，原组员都直接由新组长进行审批及管理
                </div>
                <Radio label="1">
                  <span>任命为新组长</span>
                </Radio>
                <div>
                  新增组，组员需单独设置
                </div>
              </RadioGroup>
              </Col>
            </Row>

          </div>
          <div class="modal-footer">
            <Button @click="closeModal('editorLeaderForm')">取消</Button>
            <Button
              type="primary"
              @click="leaderUp('editorLeaderForm')"
            >确定</Button>
          </div>
        </Form>
      </div>
    </Modal>

    <Modal
      v-model="downLeaderModal"
      :closable="false"
      :footer-hide="true"
    >
      <div class="modal-content">
        <Form
          ref="editorLeaderForm"
          :model="editorLeaderForm"
          :label-width="80"
        >
          <div class="modal-header">
            <span>降为组员</span>
            <a @click="closeModal('editorLeaderForm')">
              <svg-icon icon-class="close" />
            </a>
          </div>
          <div class="modal-body">
            <div class="modal-user-info">
              {{editorLeaderForm.departmentName}} {{editorLeaderForm.name}}（工号：{{editorLeaderForm.userId}}）
            </div>
            <div class="modal-user-info">请为该员工设置级别及组长</div>
            <Row>
              <Col :span="12">
              <FormItem
                label="级别"
                prop="levelName"
                :rules="{required: true,message:'选择级别',trigger: 'change'}"
              >
                <Select
                  v-model="editorLeaderForm.levelName"
                  placeholder="全部级别"
                >
                  <Option value="">全部级别</Option>
                  <template v-for="(level,index) in levelListSelect">
                    <Option
                      :key="index"
                      :value="level.levelName"
                    >{{level.levelName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
              <Col :span="12">
              <FormItem
                label="组长"
                prop="auditId"
                :rules="{required: true,type:'number',message:'选择组长',trigger: 'change'}"
              >
                <Select
                  v-model="editorLeaderForm.auditId"
                  placeholder="全部组长"
                >
                  <Option value="">全部组长</Option>
                  <template v-for="audit in auditListSelect">
                    <Option
                      :key="audit.auditId"
                      :value="audit.auditId"
                      v-if="audit.roleId === 4 &&editorLeaderForm.departmentId === audit.departmentId &&editorLeaderForm.name !== audit.auditName"
                    >{{audit.auditName}}</Option>
                  </template>
                </Select>
              </FormItem>
              </Col>
            </Row>

          </div>
          <div class="modal-footer">
            <Button @click="closeModal('editorLeaderForm')">取消</Button>
            <Button
              type="primary"
              @click="handleSubmitDownLeader('editorLeaderForm')"
            >确定</Button>
          </div>
        </Form>
      </div>
    </Modal>

  </div>
</template>
<script>
import {
  fetchUserList,
  fetchAddUser,
  fetchEditorUser,
  fetchResetUserPwd,
  fetchAddContent,
  fetchUserDetail,
  fetchDownLoadUserList,
  fetchGroupList,
  fetchLeaderDown,
  fetchLeaderUp
} from "@/api/table";
import { Pagetitle } from "@/components";
import { mapGetters } from "vuex";
export default {
  data() {
    return {
      pageshow: true,
      //总页码
      count: 0,
      //页码
      currentPage: 1,
      //总条数
      limit: 10,
      pageSizeSeletc: [
        {
          value: 10,
          label: "10条/页"
        },
        {
          value: 20,
          label: "20条/页"
        }
      ],
      modal1: false,
      pageTitle: {
        title: "员工管理",
        name: "高级搜索",
        btnName: "btnFun",
        btnClear: "btnClear"
      },
      dataTable: {
        loading: false,
        border: false,
        columns: [
          {
            minWidth: 100,

            title: "工号",
            key: "userId"
          },
          {
            minWidth: 100,

            title: "姓名",
            key: "name"
          },
          {
            minWidth: 100,

            title: "部门",
            key: "departmentName"
          },
          {
            minWidth: 100,

            title: "职位/级别",
            key: "levelName"
          },
          {
            minWidth: 100,

            title: "组别",
            key: "categoryName"
          },
          {
            minWidth: 100,

            title: "审核人",
            key: "auditName"
          },
          {
            minWidth: 100,

            title: "状态",
            key: "freeze"
          },
          {
            minWidth: 350,
            title: "操作",
            slot: "action"
          }
        ],
        data: []
      },
      addUserModal: false,
      editorUserModal: false,
      searchModal: false,
      groupUserModal: false,
      editorLeaderModal: false,
      downLeaderModal: false,
      editorLeaderForm: {
        radio: "0",
        userId: "",
        departmentName: "",
        departmentId: "",
        name: "",
        levelName: "",
        auditId: ""
      },
      groupUserSelect: [],
      auditListSelect: [],
      categoryListSelect: [],
      departmentListSelect: [],
      levelListSelect: [],
      searchForm: {
        userId: "",
        categoryName: "",
        departmentId: "",
        typeRadio: "",
        auditId: "",
        levelName: "",
        freeze: "1"
      },
      //是否显示新增组长
      isAddLeader: false,
      addUserForm: {
        name: "",
        userId: "",
        categoryName: "",
        departmentId: "",
        levelName: "",
        auditId: ""
      },
      editorUserForm: {
        userId: "",
        categoryName: "",
        departmentName: "",
        departmentId: "",
        levelName: "",
        auditId: ""
      },
      ruleValidate: {
        name: [
          {
            required: true,
            message: "填写姓名",
            trigger: "blur"
          }
        ],
        userId: [
          {
            required: true,
            message: "填写工号",
            trigger: "blur"
          }
        ],
        categoryName: [
          {
            required: true,
            message: "选择信息",
            trigger: "change"
          }
        ],
        departmentId: [
          {
            required: true,
            message: "选择信息",
            trigger: "change",
            type: "number"
          }
        ],
        levelName: [
          {
            message: "选择信息",
            trigger: "change"
          }
        ],
        auditId: [
          {
            message: "选择信息",
            trigger: "change",
            type: "number"
          }
        ]
      }
    };
  },
  components: {
    Pagetitle
  },
  mounted() {
    this.getUserList();
    this.getAddContent();
  },
  methods: {
    //分页
    changePageSize(index) {
      this.currentPage = index;
      this.getUserList();
    },
    async getUserList() {
      this.dataTable.loading = true;
      const res = await fetchUserList({
        pageNo: this.currentPage,
        pageSize: this.limit,
        userId: this.searchForm.userId,
        categoryName: this.searchForm.categoryName,
        departmentId: this.searchForm.departmentId,
        auditId: this.searchForm.auditId,
        levelName: this.searchForm.levelName,
        freeze: this.searchForm.freeze
      });
      this.closeModal();
      this.dataTable.loading = false;
      this.count = res.data.total;
      this.dataTable.data = [];
      res.data.list.forEach(item => {
        const data = {};
        data.auditName = item.auditName;
        data.auditId = item.auditId;
        data.categoryName = item.categoryName;
        data.departmentName = item.departmentName;
        data.departmentId = item.departmentId;
        data.name = item.name;
        data.freezeType = item.freeze;
        if (item.freeze === 1) {
          data.freeze = "在职";
        } else {
          data.freeze = "离职";
        }
        if (item.levelName === "组长") {
          data.isLeader = true;
        }
        data.levelName = item.levelName;
        data.userId = item.userId;
        this.dataTable.data.push(data);
      });
    },
    async getGroupList(id) {
      const res = await fetchGroupList({
        userId: id
      });
      this.groupUserSelect = [];
      res.data.forEach(item => {
        const data = {};
        data.name = item.name;
        data.userId = item.userId;
        data.roleId = item.roleId;
        if (item.userId === id) {
          data.isMe = true;
        }
        this.groupUserSelect.push(data);
      });
    },
    async leaderDown(name) {
      await this.getAddContent();
      await fetchLeaderDown({
        userId: this.editorLeaderForm.userId,
        auditId: this.editorLeaderForm.auditId,
        levelName: this.editorLeaderForm.levelName
      });
      this.closeModal(name);
      this.getUserList();
      this.$Message.success("操作成功");
    },
    async leaderUp(name) {
      await this.getAddContent();
      await fetchLeaderUp({
        userId: this.editorLeaderForm.userId,
        newGroup: this.editorLeaderForm.radio
      });
      this.closeModal(name);
      this.getUserList();
      this.$Message.success("操作成功");
    },
    async addUser(name) {
      const res = await fetchAddUser({
        userId: this.addUserForm.userId,
        name: this.addUserForm.name,
        categoryName: this.addUserForm.categoryName,
        levelName: this.addUserForm.levelName,
        departmentId: this.addUserForm.departmentId,
        auditId: this.addUserForm.auditId
      });
      this.closeModal(name);
      this.getUserList();
      this.$Message.success("添加成功");
    },
    async EditorUser(name) {
      const res = await fetchEditorUser({
        userId: this.editorUserForm.userId,
        categoryName: this.editorUserForm.categoryName,
        levelName: this.editorUserForm.levelName,
        departmentId: this.editorUserForm.departmentId,
        auditId: this.editorUserForm.auditId
      });
      this.closeModal(name);
      this.getUserList();
      this.$Message.success("修改成功");
    },
    async resetUserPwd(row) {
      const res = await fetchResetUserPwd({
        userId: row.userId
      });
      this.$Message.success("修改成功");
    },
    async liveUser(row) {
      let type;
      row.freezeType === 0 ? (type = 1) : (type = 0);
      const res = await fetchEditorUser({
        userId: row.userId,
        freeze: type
      });
      this.getUserList();
      this.$Message.success("修改成功");
    },
    async getAddContent() {
      const res = await fetchAddContent();
      this.auditListSelect = [];
      this.categoryListSelect = [];
      this.departmentListSelect = [];
      this.levelListSelect = [];
      //组长
      res.data.auditList.forEach(item => {
        const data = {};
        data.auditId = item.auditId;
        data.auditName = item.name;
        data.roleId = item.roleId;
        data.departmentId = item.departmentId;
        this.auditListSelect.push(data);
      });
      //组别
      res.data.categoryList.forEach(item => {
        const data = {};
        data.id = item.id;
        data.categoryName = item.categoryName;
        this.categoryListSelect.push(data);
      });
      //部门
      res.data.departmentList.forEach(item => {
        const data = {};
        data.id = item.id;
        data.departmentName = item.departmentName;
        this.departmentListSelect.push(data);
      });
      //级别
      res.data.levelList.forEach(item => {
        const data = {};
        data.levelName = item.levelName;
        this.levelListSelect.push(data);
      });
    },
    async getUserDetail(id) {
      const res = await fetchUserDetail({
        userId: id
      });
    },
    downLoadExl() {
      const href =
        process.env.BASE_URL +
        "user/userListDownLoad?categoryName=" +
        this.searchForm.categoryName +
        "&departmentId=" +
        this.searchForm.departmentId +
        "&auditId=" +
        this.searchForm.auditId +
        "&levelName=" +
        this.searchForm.levelName +
        "&freeze=" +
        this.searchForm.freeze +
        "&searchUserId=" +
        this.userId +
        "&userId=" +
        this.searchForm.userId;
      window.open(href, "_blank");
    },
    btnFun() {
      this.searchModal = true;
    },
    clearSearch() {
      this.searchForm = {
        userId: "",
        categoryName: "",
        departmentId: "",
        typeRadio: "",
        auditId: "",
        levelName: "",
        freeze: "1"
      };
      this.getUserList();
    },
    go(url) {
      this.$router.push({
        path: url
      });
    },
    resetForm(name) {
      this.$refs[name].resetFields();
    },
    closeModal(name) {
      if (name) {
        this.resetForm(name);
      }
      this.addUserModal = false;
      this.editorUserModal = false;
      this.searchModal = false;
      this.groupUserModal = false;
      this.editorLeaderModal = false;
      this.downLeaderModal = false;
    },
    changeUserRadioGrioup() {
      if (this.searchForm.typeRadio === "1") {
        this.searchForm.categoryName = "";
        this.searchForm.auditId = "";
      } else if (this.searchForm.typeRadio === "2") {
        this.searchForm.levelName = "";
        this.searchForm.departmentId = "";
        this.searchForm.auditId = "";
      } else {
        this.searchForm.levelName = "";
        this.searchForm.auditId = "";
        this.searchForm.userId = "";
      }
    },
    handleSubmitEditorUser(name) {
      this.$refs[name].validate(valid => {
        if (valid) {
          this.EditorUser(name);
        }
      });
    },
    handleSubmitAddUser(name) {
      this.$refs[name].validate(valid => {
        if (valid) {
          this.addUser(name);
        }
      });
    },
    // handleSubmitChangeLeader(name) {
    //   this.$refs[name].validate(valid => {
    //     if (valid) {
    //       this.leaderUp(name);
    //     }
    //   });
    // },
    handleSubmitDownLeader(name) {
      this.$refs[name].validate(valid => {
        if (valid) {
          this.leaderDown(name);
        }
      });
    },
    showGropList(row) {
      this.groupUserSelect = [];
      this.groupUserModal = true;
      this.getGroupList(row.userId);
    },
    showEditorLeader(row) {
      this.editorLeaderForm.userId = row.userId;
      this.editorLeaderForm.name = row.name;
      this.editorLeaderForm.departmentName = row.departmentName;
      this.editorLeaderModal = true;
      this.getAddContent();
    },
    showdownLeader(row) {
      this.editorLeaderForm.userId = row.userId;
      // this.editorLeaderForm.levelName = row.levelName;
      // this.editorLeaderForm.auditId = row.auditId;
      this.editorLeaderForm.name = row.name;
      this.editorLeaderForm.departmentName = row.departmentName;
      this.editorLeaderForm.departmentId = row.departmentId;
      this.downLeaderModal = true;
      this.getAddContent();
    },
    showAddUser(type) {
      this.isAddLeader = type;
      this.addUserModal = true;
    },
    showEditorUser(row) {
      this.editorUserForm.userId = row.userId;
      this.editorUserForm.name = row.name;
      this.editorUserForm.departmentName = row.departmentName;
      this.editorUserForm.departmentId = row.departmentId;
      this.editorUserForm.auditId = row.auditId;
      this.editorUserForm.levelName = row.levelName;
      this.editorUserForm.categoryName = row.categoryName;
      this.editorUserModal = true;
    },
    search() {
      this.currentPage = 1;
      this.pageshow = false;
      this.getUserList();
      this.$nextTick(() => {
        this.pageshow = true;
      });
    }
  },
  computed: {
    ...mapGetters(["userId"])
  }
};
</script>
<style>
.ivu-icon-ios-help-circle {
  display: none;
}
.ivu-table-wrapper {
  overflow: initial;
}
</style>